<template>
    <footer class="bg-gray-800 text-white p-4 w-full">
        <div class="container mx-auto text-center">
            <span v-for="(item, index) in navItems" :key="item.name">
                <a :href="item.url" class="hover:underline">
                    {{ item.name }}
                </a>
                <span v-if="index < navItems.length - 1"> &bull; </span>
            </span>
        </div>
    </footer>
</template>

<script setup>
import { defineProps } from "vue";

const props = defineProps({
    navItems: {
        type: Array,
        default: () => [],
    },
});
</script>

<style scoped>
/* 底部导航栏的样式 */
</style>